<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ddd</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<style type="text/css">
		 	div,span{
			    width: 140px;
			    height: 140px;
			    margin: 20px;
			    background: #9999CC;
			    border: #000 1px solid;
				float:left;
			    font-size: 17px;
			    font-family:Roman;
			}
			
			div.mini{
			    width: 30px;
			    height: 30px;
			    background: #CC66FF;
			    border: #000 1px solid;
			    font-size: 12px;
			    font-family:Roman;
			}
	 </style>
	 <!--引入jquery的js库-->
	 <script type="text/javascript" src="js/jquery-1.3.1.js"></script>
 
	</head>
	<body>
		您喜欢的城市:<br>
		<ul id="city">
  	    	<li id="bj" name="beijing">北京</li>
			<li id="sh" name="shanghai">上海</li>
			<li id="tj" name="tianjin">天津</li>
  	    </ul>
		
		您爱好的游戏:<br>
		<ul id="game">
  	    	<li id="fk" name="fakong">反恐</li>
			<li id="cq" name="chuangqi">传奇</li>
  	    </ul>
		
		<input type="button" id="b1" value="使用外部插入法 在上海后面创建一个反恐li,并指定id和name"/><br/>
		<input type="button" id="b2" value="使用外部插入法 把反恐li移动天津后"/>考虑还有什么...<br/>
		<input type="button" id="b3" value="使用内部插入法 把反恐li移动天津后"/>考虑还有什么...<br/>
		
	</body>
	<script language="JavaScript">
	
	//****使用外部插入法 把反恐li移动天津后
	$('#b2').click(function(){
		$("#tj").after($('#fk'));
	})
	
	//****使用内部插入法 把反恐li移动天津后
	$('#b3').click(function(){
		$('#city').append($('#fk'));
	})
	
	 //如果jquery查找一个不存在的元素、则返回一个undefined对象，如果用DOM方法来查找不存在的对象，则会发生错误。
    </script>
   
</html>



